<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Upload Images</title>
  <link rel="stylesheet" href="./css/popup.css">
</head>
<body>
  <div class="container">
    <div class="tabContent">
      <div class="img-container">
        <div class="btnFileDialog hidden">
          <div class="cover"></div>
          <div class="close1">x</div>
          <div class="content">
            <div class="tabBox">
              <span class="tab active" data-id="tab1">I2V</span>
              <span class="tab" data-id="tab2">T2V</span>
              <span class="tab" data-id="tab3">S2V</span>
            </div>
            <div class="tabContentBox">
              <div class="tabContentItem active" id="tab1">
                <div class="flex">
                  <select name="module" class="module-select" id="module-select">
                    <option value="23001">Hailuo 01</option>
                    <option value="23011">Hailuo 01-live</option>
                    <option value="23102">Hailuo 01-Director</option> 
                    <option value="23210">Hailuo 02</option>
                  </select>
                  <select name="size" id="size-select" class="module-select">
                      <option value="1">720p</option>
                      <option value="3">768p</option>
                      <option value="2">1080p</option>
                  </select>
                  <select name="time" id="time-select" class="module-select">
                      <option value="1">6s</option>
                      <option value="4">10s</option>
                  </select>
                </div>
                <div class="textItemContainer" >
                  <div class="textItem flex">
                    <textarea name="fileDescribe" id="textAreaDescribe" class="image-describe" placeholder="示例：提示词1:1》提示词2:2》提示词3:3"></textarea>
                  </div>
                </div>
                <div class="changeImg">
                  <input type="file" id="image-uploader" accept="image/*" multiple style="display: none;">
                  <label class="btnFileDialogBtn" for="image-uploader">选择图片</label>
                </div>
              </div>
              
              <div class="tabContentItem" id="tab2">
                <div class="flex">
                  <select name="module" class="module-select" id="module-select2">
                    <option value="23000">T2V-01</option>
                  </select>
                </div>
                <div class="textItemContainer" >
                  <textarea id="ttvAreaDescribe" class="image-describe" placeholder="示例：提示词1:1》提示词2:2》提示词3:3"></textarea>
                </div>
                <div>
                  <button class="text-uploader btnFileDialogBtn" type="button" id="t2v-uploader">提交</button>
                </div>
              </div>
              <div class="tabContentItem" id="tab3">
                <div class="textItemContainer" >
                  <div class="flex">
                    <select name="module" class="module-select" id="module-select3">
                      <option value="23021">S2V-01</option>
                    </select>
                  </div>
                  <div class="textItemContainer" >
                    <div class="textItem flex">
                      <textarea name="fileDescribe" id="srbAreaDescribe" class="image-describe" placeholder="示例：提示词1:1》提示词2:2》提示词3:3"></textarea>
                    </div>
                  </div>
                  <div class="changeImg">
                    <input type="file" id="S2V-image-uploader" accept="image/*" multiple style="display: none;">
                    <label class="btnFileDialogBtn" for="S2V-image-uploader">选择图片</label>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
    
        <div class="btnBox">
          <button class="btn openFileDom" id="openFileDom">
            添加图片以及描述
          </button>
          <button id="upload-button" disabled>上传图片</button>
        </div>
        <ul id="image-list">
        </ul>
        
        <div class="bottomBtnBox">
          <button id="delete-button">全部删除</button>
        </div>
      </div>
    </div>
  </div>
  <div>
    <p class="noToken">获取token失败，请打开<a target="_blank" href="https://hailuoai.video/">https://hailuoai.video/</a></p>
    <p class="noPointer hidden">积分不足，前往<a target="_blank" href="https://hailuoai.video/">https://hailuoai.video/</a>充值</p>
  </div>
  <script src="script/popup.js" type="module"></script>
</body>
</html>